<template>
    <div style="line-height: 50px;display: flex;background-color: hsl(220, 70%, 26%);">
      <div style="width: 400px;margin-left:10px; font-weight: bold;font-size: 20px; color:#fff">景区管理系统</div>
      <div style="flex: 1"></div>
      <span v-bind:interval="'1000'">{{ this.datime }}</span>
      <div class="right-info">
            
            <el-dropdown trigger="click">
            <span class="el-dropdown-link el-icon-user" style="color: #fff;">
              个人中心<i class="el-icon-arrow-down el-icon--right"></i>
            </span>
            <template slot="dropdown">
            <el-dropdown-menu >
              <el-dropdown-item @click.native="selfInfoManage">个人信息</el-dropdown-item>
              <el-dropdown-item @click.native="SignOut">退出登录</el-dropdown-item>
            </el-dropdown-menu>
          </template>
          </el-dropdown>
       
      </div>
    </div>
  </template>
  
  <script>
  
  import request from "@/utils/request";
  // 格式化日对象
const getNowDate = () => {
  var date = new Date();
  var sign2 = ":";
  var year = date.getFullYear() // 年
  var month = date.getMonth() + 1; // 月
  var day = date.getDate(); // 日
  var hour = date.getHours(); // 时
  var minutes = date.getMinutes(); // 分
  var seconds = date.getSeconds() //秒
  var weekArr = ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六', '星期天'];
  var week = weekArr[date.getDay()];
  // 给一位数的数据前面加 “0”
  if (month >= 1 && month <= 9) {
    month = "0" + month;
  }
  if (day >= 0 && day <= 9) {
    day = "0" + day;
  }
  if (hour >= 0 && hour <= 9) {
    hour = "0" + hour;
  }
  if (minutes >= 0 && minutes <= 9) {
    minutes = "0" + minutes;
  }
  if (seconds >= 0 && seconds <= 9) {
    seconds = "0" + seconds;
  }
  return year + "-" + month + "-" + day + " " + hour + sign2 + minutes + sign2 + seconds;
}

  

  
  export default {
    name: "Header",
    data() {
      return {
        name: '',
       
      
        datime:getNowDate()
      }
    },
    created() {
      setInterval(() => {
      this.datime= getNowDate()
    }, 1000)
    },
    methods: {
      SignOut() {
       
       
        this.$message({
                      message: "退出成功",
                       type: 'success'
                    });
        window.sessionStorage.removeItem("token"); 
        this.$router.replace({path: '/login'});
      },
      selfInfoManage() {
        this.$router.replace("/selfInfo")
        console.log('111')
      },
     
    },
  }
  </script>
  
  <style scoped>
  .right-info {
    width: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 1.5%;
  }
  
  .right-info:hover {
    cursor: pointer;
  }
  span {
    width: 200px;
    color: #fff;
  }
  </style>